<template>
  <a-modal
    :visible="visible"
    :title="title"
    @cancel="() => { $emit('cancel') }"
    @ok="() => { $emit('submit') }"
  >
    <a-form layout="vertical" :form="form">
      <a-form-item :label="$t('all.autotext296')" >
        <a-input
          v-decorator="[
            'name',
            {
              initialValue: initialFormValue.name,
              rules: [{ required: true, message: $t('all.autotext81') }],
            }
          ]"
          :disabled="!isEdit"
        />
      </a-form-item>
      <a-form-item :label="$t('all.autotext413')" >
        <a-input
          v-decorator="[
            'url',
            {
              initialValue: initialFormValue.url,
              rules: [{ required: true, message: $t('all.autotext707') }],
            }
          ]"
          :disabled="!isEdit"
        />
      </a-form-item>
      <a-form-item label="权限标识(后端)" >
        <a-input
          v-decorator="[
            'code',
            {
              initialValue: initialFormValue.code,
              rules: [{ required: false, message: $t('all.autotext707') }],
            }
          ]"
          :disabled="!isEdit"
        />
      </a-form-item>
      <a-form-item :label="$t('all.autotext496')" >
        <a-select
          v-decorator="[
            'isPublic',
            {
              initialValue: initialFormValue == null ? -1 : initialFormValue.isPublic,
              rules: [{ required: true, message: $t('all.autotext78') }],
            }
          ]"
          :placeholder="$t('all.autotext1348')"
          :disabled="!isEdit"
        >
          <a-select-option v-for="type in publicOptions" :key="type.value" :value="type.value">{{ type.label }}</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="pid" style="display: none">
        <a-input
          v-decorator="[
            'pid',
            {
              initialValue: initialFormValue.pid
            }
          ]"
        />
      </a-form-item>
      <a-form-item label="pids" style="display: none">
        <a-input
          v-decorator="[
            'pids',
            {
              initialValue: initialFormValue.pids
            }
          ]"
        />
      </a-form-item>
      <a-form-item label="type" style="display: none">
        <a-input
          v-decorator="[
            'type',
            {
              initialValue: initialFormValue.type
            }
          ]"
        />
      </a-form-item>
      <a-form-item label="id" style="display: none">
        <a-input
          v-decorator="[
            'id',
            {
              initialValue: initialFormValue.id
            }
          ]"
        />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
export default {

  props: {
    visible: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: ''
    },
    initialFormValue: {
      type: Object,
      default: null
    },
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      publicOptions: [
        { label: this.$t('all.autotext843'), value: 1 },
        { label: this.$t('all.autotext543'), value: -1 }
      ]
    }
  },
  beforeCreate () {
    this.form = this.$form.createForm(this)
  }
}
</script>
